<template>
  <p style="text-align: right; padding: 5px">
    <a-button @click="exportExcel" type="primary" link
      ><template #icon>
        <file-excel-outlined />
      </template>
      导出</a-button
    >
  </p>
  <a-table
    class="table"
    v-if="state.data?.rows"
    :data-source="planList(state.data.rows)"
    :columns="state.columns"
    rowKey="id"
    stripe
    bordered
    :pagination="false"
    size="small"
  >
    <template v-if="state.innerColumns" #expandedRowRender="{ record }">
      <a-table
        :columns="state.innerColumns"
        :data-source="planList(record.inner)"
        rowKey="id"
        bordered
        :pagination="false"
        size="small"
      >
      </a-table>
    </template>
  </a-table>
</template>
<script setup>
import { getCurrentInstance, reactive, watch } from "vue";
import { showWorkLabel, workColumns, innerColumns } from "@/utils/workflow";
import _ from "lodash";
import { planList } from "@/utils/planList";

const { proxy } = getCurrentInstance();
const props = defineProps(["work"]);
const state = reactive({
  columns: [],
  innerColumns: null,
  data: null,
});

// 三级界面API集合
const apis = {
  0: "/calibration/stat/ship_cut/third",
  1: "/calibration/stat/ship_old/third",
  2: "/calibration/stat/ship_weld/third",
  "4-0": "/calibration/stat/paint_house/third",
  "4-1": "/calibration/stat/paint_ship/third",
  "5-0": "/calibration/stat/sand_house/third",
  "5-1": "/calibration/stat/sand_ship/third",
  "6-0": "/calibration/stat/water_clean_point/third",
  "6-1": "/calibration/stat/water_clean/third",
  "6-2": "/calibration/stat/water_clean_rust/third",
  "6-3": "/calibration/stat/water_clean_rust_ship/third",
};

// 根据工序在二级界面摘取显示字段
const pickColumns = (work, columns) => {
  let pickArray = [];
  if (work === "0") {
    pickArray = ["device", "deviceNo", "powerByUnit", "o2ByUnit", "airByUnit"];
  } else if (work === "1") {
    pickArray = ["gasByUnit", "o2ByUnit"];
  } else if (work === "2") {
    pickArray = ["co2ByUnit", "powerByUnit"];
  } else if (work === "4-0") {
    pickArray = ["powersByUnit", "airByUnit", "gasByUnit"];
  } else if (work === "4-1") {
    pickArray = ["airByUnit"];
  } else if (work === "5-0") {
    pickArray = ["powerByUnit", "airByUnit"];
  } else if (work === "5-1") {
    pickArray = ["airByUnit"];
  } else if (work === "6-0") {
    pickArray = ["powerUnit"];
  } else if (work === "6-1") {
    pickArray = ["powerUnit"];
  } else if (work === "6-2") {
    pickArray = ["powerUnit"];
  }
  return _.filter(columns, (o) => !pickArray.includes(o.key));
};

watch(
  () => props.work,
  (work) => {
    if (work) {
      // 获取工序的信息
      const theWork = work;
      const _columns = pickColumns(theWork, workColumns[theWork]);
      state.columns = _.map(_columns, (o) => ({
        ...o,
        ellipsis: true,
      }));
      if (innerColumns[theWork]) {
        state.innerColumns = innerColumns[theWork];
      }

      proxy.$axios.get(apis[theWork]).then(({ success, data }) => {
        if (success) {
          state.data = data;
        } else {
          state.data = null;
        }
      });
    }
  },
  { immediate: true }
);

const excel_apis = {
  // 船体下料
  0: "/excel/export/calibration/stat/ship_cut/third",
  // 船体割旧
  1: "/excel/export/calibration/stat/ship_old/third",
  // 船体焊接
  2: "/excel/export/calibration/stat/ship_weld/third",
  // 喷漆房分段喷漆
  "4-0": "/excel/export/calibration/stat/paint_house/third",
  // 舱室及船壳喷漆
  "4-1": "/excel/export/calibration/stat/paint_ship/third",
  // 打砂房分段打砂
  "5-0": "/excel/export/calibration/stat/sand_house/third",
  // 舱室打砂
  "5-1": "/excel/export/calibration/stat/sand_ship/third",
  // 超水清洁点打
  "6-0": "/excel/export/calibration/stat/water_clean_point/third",
  // 超水清洁
  "6-1": "/excel/export/calibration/stat/water_clean/third",
  // 超水除锈
  "6-2": "/excel/export/calibration/stat/water_clean_rust/third",
  // 舱盖超水除锈
  "6-3": "/excel/export/calibration/stat/water_clean_rust_ship/third",
};

const exportExcel = () => {
  const url = excel_apis[props.work];
  const name = showWorkLabel(props.work);
  proxy.$axios
    .get(url, {
      responseType: "blob",
    })
    .then((data) => {
      const blobUrl = window.URL.createObjectURL(data);
      const link = document.createElement("a");
      link.href = blobUrl;
      link.download = `${name}.xlsx`;
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
      window.URL.revokeObjectURL(blobUrl);
    });
};
</script>
<style lang="less" scoped></style>
